<template>
  <view class="container">
	      <view class="text-area">
	        <text class="label">选中的猪编号：</text>
	        <text class="value" @tap="show = true">{{info || "请选择需要投喂的猪"}}</text>
	      </view>
	<multiple-select
	v-model="show"
	:data="list0"
	:default-selected="defaultSelected"
	@confirm="confirm"
	></multiple-select>
	<view class="item" v-for="item in list" :key="item.name">
		 <text>{{item.name}}:</text>
		  <input type="number" maxlength="16" v-model="item.value">
		  <text class="weight">斤</text>
	</view>
	<button type="primary" class="btn" @tap="feed()">投喂</button>
  </view>
</template>

<script>
	import multipleSelect from "../../../../../components/momo-multipleSelect/momo-multipleSelect.vue";
	export default {
		components: {
		  multipleSelect,
		},
		data() {
			return {
				d1:"",
				show: false, //是否显示 - 双向绑定
				info: "",
				results:[],
				list0: [
					{
						"label":"0021",
						"value":"1",

					},
					{	
						"label":"0045",
						"value":"2",

					},
					{
						"label":"0225",
						"value":"3",

					},
					{	
						"label":"0115",
						"value":"4",

					},
					{	
						"label":"0025",
						"value":"5",

					},
					{	
						"label":"0015",
						"value":"6",

					}					
				], //数据源
				defaultSelected: [], //默认选中项
				list:[
					{
						name:"玉米面",
						value:""
					},
					{
						name:"豆饼",
						value:""
					},
					{
						name:"细糠",
						value:""
					},
					{
						name:"食盐",
						value:""
					},
					{
						name:"骨粉",
						value:""
					},
					{
						name:"贝粉",
						value:""
					},
					{
						name:"预混料",
						value:""
					},
					{
						name:"炒黄豆粉",
						value:""
					},
					{
						name:"鱼粉",
						value:""
					},
					{
						name:"秸秆粉",
						value:""
					},
					{
						name:"米糠",
						value:""
					}																																				
				]
			};
		},
		methods:{
			onClickItem(e) {
				if (this.current !== e.currentIndex) {
					this.current = e.currentIndex;
				}
			},
			confirm(data) {
				this.results=data;
				this.info = data.map((el) => el.label).join(",");
			},
			feed(){
				let str='';
				for(let i=0; i<this.results.length; i++){
					str+=this.results[i].label+"号猪，";
				}
				if(str.length==0){
					uni.showToast({
						icon: 'none',
						title: '未选择猪',
						duration:1700
					});					
				}else{
					uni.showToast({
						icon: 'none',
						title: '开始向'+str+'喂食',
						duration:1700
					});					
				}

			}
		}
	}
</script>

<style lang="scss" scoped>
    .container{
        margin-top:8%;
		width: 100%;
    
    }
	.item{
		width: 60%;
		margin: 5% 0 0 27%;
	    display: flex;
	}   
	text{
		width: 40%;
	    margin:0 0 0 0;
	}
	input{
	    width:30%;
	    height:20px;
	    margin:0 2% 0 5%;
	    background: #ddd;
	}
	.btn{
		width: 40%;
		margin:8% 0 0 25%;
	}
	.text-area {
		width: 100%;
		margin-top: 3%;
		display: flex;
		justify-content: center;
		font-size: 28rpx;
		box-sizing: border-box;
		padding: 10rpx;
	}
  .value {
    color: #2088f9;
  }
  .title {
    text-align: center;
    font-size: 36rpx;
    color: #2088f9;
    margin-top: 5px;
  }
</style>
